<template>
  <div>
    <header-page title="CSS篇" />
    <router-link class="link" to="/css/BFC">BFC</router-link>
    <router-link class="link" to="/css/cssCenter">css居中</router-link>
    <router-link class="link" to="/css/cssCenter">6位验证码输入实现</router-link>
    <a class="link" @click="changeCM">切换组件</a>
    <a class="link" >{{content}}</a>

  </div>
</template>
<script>
import HeaderPage from './../../components/common/header';

export default {
  components: {
    HeaderPage,
  },
  data() {
    return {
      content: 'default',
    };
  },
  activated() {
    console.log('css组件被激活');
  },
  deactivated() {
    console.log('css组件被停用');
  },
  methods: {
    changeCM() {
      this.content = 'content内容';
    },
  },
};
</script>
